<template>
  <div class="serveBox">
    <div class="statusTitle">已开通功能</div>
    <div class="serveTitle">
      <i class="el-icon-office-building"/>
      <span>网校功能管理</span>
    </div>
    <online-school/>
    <div class="serveTitle">
      <i class="el-icon-s-management"/>
      <span>教学功能管理</span>
    </div>
    <teaching/>
    <div class="serveTitle">
      <i class="el-icon-s-finance"/>
      <span>课程功能管理</span>
    </div>
    <course/>
    <div class="serveTitle">
      <i class="el-icon-s-promotion"/>
      <span>运营功能管理</span>
    </div>
    <operation/>

    <div class="statusTitle">未开通功能</div>
    <not-available/>
    <router-view></router-view>
  </div>
</template>
<script>
import onlineSchool from './components/dredgeserve/onlineschool'
import teaching from './components/dredgeserve/teaching'
import course from './components/dredgeserve/course'
import operation from './components/dredgeserve/operation'
import notAvailable from './components/dredgeserve/notavailable'
export default {
  components: {
    onlineSchool,
    teaching,
    course,
    operation,
    notAvailable
  },
  data() {
    return {

    }
  }
}
</script>

<style lang="scss" scoped>
.serveBox {
  padding: 20px;
  .statusTitle {
    padding: 10px;
    background-color: #ACD0F5;
    color: #303133;
  }
  .serveTitle {
    padding: 10px;
    color: #666;
    border-bottom: 1px solid #ececec;
  }
}
</style>
